<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户登录</title>
    <link href="https://fonts.googleapis.com/css?family=Lato:300,400&display=swap" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="/css/style/styles.css" />
    <script src="/js/jquery-3.6.1.min.js"></script>
    <script src="/js/bootstrap.min.js"></script>
</head>
<body>

<div class="login-div">
    <div class="logo"></div>
    <div class="title">欢迎使用学生成绩管理系统</div>
    <div class="fields">
        <div class="username">

            <input tvpe="username" class="user-input" placeholder="用户名" id="username" name="username"/></div>
        <div class="password">

            <input type="password" class="pass-input" placeholder="密码" id="password" name="password" /></div>
    </div>
    <a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>

    <input id="admin" checked type="radio" name="role" value="3" style="margin: 0 10px;">
    <label for="admin" style="color: white;">管理员&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>

    <input id="teacher" checked type="radio" name="role" value="2" style="margin: 0 10px;">
    <label for="teacher" style="color: white;">教师&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>

    <input id="student" checked type="radio" name="role" value="1" style="margin: 0 10px;">
    <label for="student" style="color: white;">学生</label>

    <br/><br/><br/><br/>

    <button type="button" class="signin-button" onclick="login();">登录</button>
</div>

<script type="text/javascript">

    function login(){

        var name=$("#username").val();

        var password=$("#password").val();

        var usertype=$("[name='role']:checked").val();

        var len1=document.getElementById("username").value.length;

        var len2=document.getElementById("password").value.length;

        if(len1==0&&len2==0){
            alert("请输入登录名及密码！");
            return;
        }
        if(len1==0){

            alert("用户名不能为空");
            return;
        }

        if(len2==0){

            alert("密码不能为空");
            return;
        }

        $.ajax({

            url:"/webapi/login/user",
            data:{

                username:name,
                password:password,

            }
        }).done(function (rs){

            if(rs==1 && $("[name='role']:checked").val()==1 ){

                //学生登录成功
                alert("同学你好,登录成功！点“确定”跳转");
                document.getElementById("username").value='';
                document.getElementById("password").value='';
                window.location.href="http://localhost:8080/student/list";
            }

            else if(rs==2 && $("[name='role']:checked").val()==2 ){

                //教师登录成功
                alert("欢迎您！点“确定”会跳转界面");
                document.getElementById("username").value='';
                document.getElementById("password").value='';
                window.location.href="http://localhost:8080/teacher/LIST";
            }
            else if(rs==3 && $("[name='role']:checked").val()==3 ){
                //管理员登录成功
                alert("欢迎您！点“确定”会跳转界面");
                document.getElementById("username").value='';
                document.getElementById("password").value='';
                window.location.href="http://localhost:8080/admin/List";
            }
            else{

                alert("不正确的用户名或密码！请重试");
                document.getElementById("password").value='';   //清空密码
            }
        });
    }

</script>
</body>
</html>